<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { onLoad, onShow } from "@dcloudio/uni-app";
import card from "../components/withdraw-deposit/card.vue";
import { apiBrokerageList } from "@/apis/withdraw";
import { router } from "@/utils/tools";
import { onReachBottom } from "@dcloudio/uni-app";
const pageNum = ref(1);
const pageSize = ref(15);
const isMore = ref(false);
let state = reactive({
  list: [],
});
const getList = async () => {
  let params = {
    pageNum: pageNum.value, //页数
    pageSize: pageSize.value, //行数
  };
  let res = await apiBrokerageList(params);

  if (res.rows.length <= 0) {
    isMore.value = true;
    return false;
  }
  pageNum.value++;

  Object.assign(state.list, res.rows);
};
onLoad(() => {
  getList();
});

onReachBottom((e: any) => {
  getList();
});

// withdraw-deposit/record
</script>

<template>
  <view class="">
    <view>
      <view
        class="menu-list"
        v-for="(item, index) in state.list"
        :key="index"
        @click="
          router(
            `/pagesOrder/withdraw-deposit/withdrawal_details?id=${item.id}`
          )
        "
      >
        <view class="title-box">
          <!-- <view class="time">
            {{ item.time }}
            <image src="@/static/images/pull_down.png" />
          </view> -->
          <!-- <view class="money">提现 ￥ {{ item.money }}</view> -->
        </view>
        <!-- <view class="menu-box" v-for="(itema, index) in item.record"> -->

        <card :cardItem="item"></card>
        <!-- </view> -->
      </view>
    </view>
  </view>

  <uv-load-more
    height="60"
    status="nomore"
    fontSize="12px"
    nomoreText="人家也是有底线哒"
    :line="true"
    v-if="isMore"
  />
  <uv-empty
    mode="list"
    text="提现记录为空"
    v-if="state.list.length <= 0"
  ></uv-empty>
</template>

<style lang="scss" scoped>
.code {
  display: flex;
  align-items: center;
  justify-content: center;
  justify-content: space-between;
}

.menu-list {
  .title-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 30rpx 30rpx 20rpx 30rpx;
    box-sizing: border-box;

    .time {
      display: flex;
      align-items: center;
      color: rgba(51, 51, 51, 1);
      font-size: 32rpx;

      image {
        width: 36rpx;
        height: 36rpx;
        margin-left: 10rpx;
      }
    }

    .money {
      color: rgba(190, 190, 190, 1);
      font-size: 28rpx;
    }
  }

  .menu-box {
    width: 100%;
    padding: 20rpx 30rpx 0;
    box-sizing: border-box;
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 0rpx 2rpx 4rpx 0rpx rgba(0, 0, 0, 0.1);
  }
}
</style>
